import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../controllers/login_controller.dart';

class LoginView extends GetView<LoginController> {
  const LoginView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: true,
      backgroundColor: const Color(0xFFEDF3FA),
      body: GestureDetector(
        onTap: () {
          // 点击空白处隐藏键盘
          FocusScope.of(context).unfocus();
        },
        child: _LoginForm(),
      ),
    );
  }
}

class _LoginForm extends GetView<LoginController> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: Get.width,
      height: Get.height,
      decoration: const BoxDecoration(
        image: DecorationImage(
          image: AssetImage('assets/images/login_bg.png'),
          fit: BoxFit.cover,
        ),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Container(
            margin: EdgeInsets.only(top: 190.h),
            width: 690.w,
            height: 748.h,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: AssetImage('assets/images/form_bg.png'),
                fit: BoxFit.cover,
              ),
            ),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                SizedBox(height: 190.h),
                Form(
                  key: controller.formKey,
                  child: Column(
                    children: [
                      // 账号输入框
                      Container(
                        width: 627.w,
                        height: 88.h,
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(20.r),
                          border: Border.all(
                            color: const Color(0xFFE1E1E1),
                            width: 1.w,
                          ),
                          boxShadow: [
                            BoxShadow(
                              color: const Color(
                                0xFFD0D0D0,
                              ).withValues(alpha: 0.3),
                              offset: Offset(0, 4.h),
                              blurRadius: 10.r,
                            ),
                          ],
                        ),
                        child: Row(
                          children: [
                            SizedBox(width: 20.w),
                            Image.asset(
                              'assets/images/user_icon.png',
                              width: 40.w,
                              height: 40.h,
                            ),
                            SizedBox(width: 19.w),
                            Expanded(
                              child: TextFormField(
                                controller: controller.phoneController,
                                validator: controller.validatePhone,
                                decoration: InputDecoration(
                                  hintText: '请输入账号',
                                  hintStyle: TextStyle(
                                    fontSize: 28.sp,
                                    fontFamily: 'Source Han Sans CN',
                                    color: const Color(0xFF999999),
                                    height: 1.0,
                                  ),
                                  border: InputBorder.none,
                                  contentPadding: EdgeInsets.zero,
                                ),
                                style: TextStyle(
                                  fontSize: 28.sp,
                                  fontFamily: 'Source Han Sans CN',
                                  color: const Color(0xFF333333),
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(height: 34.h),
                      // 密码输入框
                      Container(
                        width: 627.w,
                        height: 88.h,
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(20.r),
                          border: Border.all(
                            color: const Color(0xFFE1E1E1),
                            width: 1.w,
                          ),
                        ),
                        child: Row(
                          children: [
                            SizedBox(width: 20.w),
                            Image.asset(
                              'assets/images/lock_icon.png',
                              width: 40.w,
                              height: 40.h,
                            ),
                            SizedBox(width: 19.w),
                            Expanded(
                              child: Obx(
                                () => TextFormField(
                                  controller: controller.passwordController,
                                  validator: controller.validatePassword,
                                  obscureText:
                                      !controller.isPasswordVisible.value,
                                  decoration: InputDecoration(
                                    hintText: '请输入密码',
                                    hintStyle: TextStyle(
                                      fontSize: 28.sp,
                                      fontFamily: 'Source Han Sans CN',
                                      color: const Color(0xFF999999),
                                      height: 1.0,
                                    ),
                                    border: InputBorder.none,
                                    contentPadding: EdgeInsets.zero,
                                  ),
                                  style: TextStyle(
                                    fontSize: 28.sp,
                                    fontFamily: 'Source Han Sans CN',
                                    color: const Color(0xFF333333),
                                  ),
                                ),
                              ),
                            ),
                            GestureDetector(
                              onTap: controller.togglePasswordVisibility,
                              child: Padding(
                                padding: EdgeInsets.only(right: 20.w),
                                child: Obx(
                                  () =>
                                      controller.isPasswordVisible.value
                                          ? Image.asset(
                                            'assets/images/eye_open_icon.png',
                                            width: 40.w,
                                            height: 40.h,
                                          )
                                          : Image.asset(
                                            'assets/images/eye_close_icon.png',
                                            width: 40.w,
                                            height: 40.h,
                                          ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      // SizedBox(height: 16.h),
                      // 忘记密码
                      // Align(
                      //   alignment: Alignment.centerRight,
                      //   child: GestureDetector(
                      //     onTap: controller.forgotPassword,
                      //     child: Text(
                      //       '忘记密码',
                      //       style: TextStyle(
                      //         fontSize: 28.sp,
                      //         fontFamily: 'Source Han Sans',
                      //         color: const Color(0xFF047FF7),
                      //       ),
                      //     ),
                      //   ),
                      // ),
                    ],
                  ),
                ),
                SizedBox(height: 50.h),
                Obx(
                  () => GestureDetector(
                    onTap: controller.isLoading.value ? null : controller.login,
                    child: Container(
                      width: 627.w,
                      height: 88.h,
                      decoration: BoxDecoration(
                        color:
                            controller.isLoading.value
                                ? const Color(0xFFE0E0E0)
                                : const Color(0xFFDEEDFF),
                        borderRadius: BorderRadius.circular(20.r),
                        border: Border.all(
                          color:
                              controller.isLoading.value
                                  ? const Color(0xFFBDBDBD)
                                  : const Color(0xFF79B4F9),
                          width: 1.w,
                        ),
                      ),
                      child: Center(
                        child:
                            controller.isLoading.value
                                ? SizedBox(
                                  width: 20.w,
                                  height: 20.h,
                                  child: const CircularProgressIndicator(
                                    strokeWidth: 2,
                                    color: Color(0xFF333333),
                                  ),
                                )
                                : Text(
                                  '登录',
                                  style: TextStyle(
                                    fontSize: 28.sp,
                                    fontFamily: 'Source Han Sans CN',
                                    color: const Color(0xFF333333),
                                    height: 1.33,
                                  ),
                                ),
                      ),
                    ),
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(top: 50.h),
                  width: 690.w,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      // 复选框
                      GestureDetector(
                        onTap: controller.toggleAgreement,
                        child: Obx(
                          () => Container(
                            width: 30.w,
                            height: 30.h,
                            margin: EdgeInsets.only(top: 5.h),
                            decoration: BoxDecoration(
                              shape: BoxShape.circle,
                              color:
                                  controller.isAgreementChecked.value
                                      ? const Color(0xFF047FF7)
                                      : Colors.white,
                            ),
                            child:
                                controller.isAgreementChecked.value
                                    ? const Icon(
                                      Icons.check,
                                      color: Colors.white,
                                      size: 18,
                                    )
                                    : null,
                          ),
                        ),
                      ),
                      SizedBox(width: 20.w),
                      Row(
                        children: [
                          Text(
                            '已阅读并同意《',
                            style: TextStyle(
                              fontSize: 24.sp,
                              fontFamily: 'Source Han Sans CN',
                              color: const Color(0xFF333333),
                              height: 1.33,
                            ),
                          ),
                          GestureDetector(
                            onTap: controller.openUserAgreement,
                            child: Text(
                              '用户协议',
                              style: TextStyle(
                                fontSize: 24.sp,
                                fontFamily: 'Source Han Sans CN',
                                color: const Color(0xFF047FF7),
                                height: 1.33,
                              ),
                            ),
                          ),
                          Text(
                            '》和《',
                            style: TextStyle(
                              fontSize: 24.sp,
                              fontFamily: 'Source Han Sans CN',
                              color: const Color(0xFF333333),
                              height: 1.33,
                            ),
                          ),
                          GestureDetector(
                            onTap: controller.openPrivatePolicy,
                            child: Text(
                              '隐私政策',
                              style: TextStyle(
                                fontSize: 24.sp,
                                fontFamily: 'Source Han Sans CN',
                                color: const Color(0xFF047FF7),
                                height: 1.33,
                              ),
                            ),
                          ),
                          Text(
                            '》',
                            style: TextStyle(
                              fontSize: 24.sp,
                              fontFamily: 'Source Han Sans CN',
                              color: const Color(0xFF333333),
                              height: 1.33,
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
